/**
 * Created by Administrator on 2017/5/20.
 * @name:   vip-admin 后台模板 菜单navJS
 * @author: 随丶
 */
layui.define(['layer', 'element'], function (exports) {
    // 操作对象
    var layer = layui.layer
        , element = layui.element
        , $ = layui.jquery;


    // 封装方法
    var mod = {

        // 添加 HTMl
        addHtml: function (addr, obj, treeStatus, data) {
            // 请求数据


            $.get(addr, data, function (res) {


                var view = "";
                if (res.data) {
                    $(res.data).each(function (k, v) {

                        v.subset && treeStatus ? view += '<li class="layui-nav-item layui-nav-itemed">' : view += '<li class="layui-nav-item">';
                        if (v.subset) {
                            view += '<a href="javascript:;" class="active"><i class="layui-icon">' + v.icon + '</i>' + v.text + '</a><dl class="layui-nav-child">';
                            $(v.subset).each(function (ko, vo) {
                                view += '<dd>';

                                if (vo.target) {
                                    view += '<a href="' + vo.href +'?v='+develop.version+ '" target="_blank">';
                                } else {
                                    view += '<a href="javascript:;" href-url="' + vo.href +'?v='+develop.version+ '">';
                                }

                                if (vo.icon) {
                                    view += '<i class="layui-icon">' + vo.icon + '</i>' + vo.text + '</a>';
                                } else {
                                    view += '<i class="layui-icon"></i>' + vo.text + '</a>';
                                }

                                if (vo.children) {
                                    var childHtml = '<ol>';
                                    $(vo.children).each(function (kco, cvo) {
                                        childHtml += '<li><a href="javascript:;" href-url="' + cvo.href +'?v='+develop.version+ '">' + cvo.text + '<i></i></a></li>';
                                    });
                                    childHtml += "</ol>";
                                    view += childHtml;
                                }

                                view += '</dd>';

                            });
                            view += '</dl>';
                        } else {
                            if (v.target) {
                                view += '<a href="' + v.href +'?v='+develop.version+ '" target="_blank">';
                            } else {
                                view += '<a href="javascript:;"   class="active" href-url="' + v.href +'?v='+develop.version+ '">';
                            }
                            view += '<i class="layui-icon">' + v.icon + '</i>' + v.text + '</a>';
                        }
                        view += '</li>';
                    });
                } else {
                    layer.msg('接受的菜单数据不符合规范,无法解析');
                }
                // 添加到 HTML
                $(document).find(".layui-nav[lay-filter=" + obj + "]").html(view);
                // 更新渲染
                element.init();
            }, 'json');
        }
        // 左侧主体菜单 [请求地址,过滤ID,是否展开,携带参数]
        ,
        //添加左边的html
        addTopLeftHtml: function (addr, obj, treeStatus, data) {
            // 请求数据
            $.get(addr, data, function (res) {
                var view = "";
                if (res.data) {
                    $(res.data).each(function (k, v) {
                        v.subset && treeStatus ? view += '<li class="layui-nav-item layui-nav-itemed">' : view += '<li class="layui-nav-item">';
                        if (v.subset) {
                            view += '<a href="javascript:;"><i class="layui-icon">' + v.icon + '</i>' + v.text + '</a><dl class="layui-nav-child">';
                            $(v.subset).each(function (ko, vo) {

                                view += '<dd>';
                                if (vo.target) {
                                    view += '<a href="' + vo.href +'?v='+develop.version+ '" target="_blank">';
                                } else {
                                    view += '<a href="javascript:;" href-url="' + vo.href +'?v='+develop.version+ '">';
                                }
                                view += '<i class="layui-icon">' + vo.icon + '</i>' + vo.text + '</a></dd>';
                            });
                            view += '</dl>';
                        } else {
                            if (v.target) {
                                view += '<a href="' + v.href +'?v='+develop.version+ '" target="_blank">';
                            } else {
                                view += '<a href="javascript:;" href-url="' + v.href +'?v='+develop.version+ '">';
                            }
                            view += '<i class="layui-icon">' + v.icon + '</i>' + v.text + '</a>';
                        }
                        view += '</li>';
                    });
                } else {
                    layer.msg('接受的菜单数据不符合规范,无法解析');
                }
                // 添加到 HTML
                $(document).find(".layui-nav[lay-filter=" + obj + "]").html(view);
                // 更新渲染
                element.init();
            }, 'json');
        }
        , main: function (addr, obj, treeStatus, data) {
            // 添加HTML
            this.addHtml(addr, obj, treeStatus, data);
        },
        mainAjax: function (res, obj, treeStatus) {
            var view = "";
            if (res.data) {
                $(res.data).each(function (k, v) {
                    var vIcon = v.icon;
                    if (vIcon === undefined) {
                        vIcon = '';
                    }
                    v.subset && treeStatus ? view += '<li class="layui-nav-item layui-nav-itemed">' : view += '<li class="layui-nav-item">';
                    if (v.subset) {
                        //view += '<a href="javascript:;" class="active"><i class="layui-icon">' + vIcon + '</i>' + v.text + '<span class="layui-nav-more"></span></a><dl class="layui-nav-child">';
                        view += '<a href="javascript:;" data-icon="' + v.iconName + '" class="active"><i class="layui-icon">&nbsp;</i>' + v.text + '<span class="layui-nav-more"></span></a><dl class="layui-nav-child">';
                        $(v.subset).each(function (ko, vo) {
                            view += '<dd>';

                            if (vo.target) {
                                view += '<a href="' + vo.href +'?v='+develop.version+ '" target="_blank">';
                            } else {
                                if (vo.href == undefined || vo.href =="") {
                                    view += '<a href="javascript:;">';
                                } else {
                                    view += '<a href="javascript:;" href-url="' + vo.href +'?v='+develop.version+ '">';
                                }
                            }

                            if (vo.icon) {
                                //view += '<i class="layui-icon">' + vo.icon + '</i>' + vo.text + '</a>';
                                view += '<i class="layui-icon">&nbsp;</i>' + vo.text + '</a>';
                            } else if(vo.children){
                                view += '<i class="layui-icon"></i>' + vo.text + '<span class="layui-nav-more"></span></a>';
                            }else{
                                view += '<i class="layui-icon"></i>' + vo.text + '</a>';
                            }

                            if (vo.children) {
                                var childHtml = '<ol>';
                                $(vo.children).each(function (kco, cvo) {
                                    childHtml += '<li><a href="javascript:;" href-url="' + cvo.href +'?v='+develop.version+ '">' + cvo.text + '<i></i></a></li>';
                                });
                                childHtml += "</ol>";
                                view += childHtml;
                            }
                            view += '</dd>';
                        });
                        view += '</dl>';
                    } else {
                        if (v.target) {
                            view += '<a  data-icon="' + v.iconName + '" href="' + v.href +'?v='+develop.version+ '" target="_blank">';
                        } else {
                            view += '<a  data-icon="' + v.iconName + '" href="javascript:;" class="index-btn" class="active" href-url="' + v.href +'?v='+develop.version+ '">';
                        }
                        //view += '<i class="layui-icon">' + vIcon + '</i>' + v.text + '</a>';
                        view += '<i class="layui-icon">&nbsp;</i>' + v.text + '</a>';
                    }
                    view += '</li>';

                });
            } else {
                layer.msg('接受的菜单数据不符合规范,无法解析');
            }
            // 添加到 HTML
            $(document).find(".layui-nav[lay-filter=" + obj + "]").html(view);
            // 更新渲染
            element.init();
            //重设菜单栏滚动的高度
            // $('.layui-side-scroll').height($(window).height()-230);
            //监听高度的变化重设高度
            $(window).resize(function(){
                // if($('.side-info-bom').attr('class').indexOf('hidden')==-1){
                //     $('.layui-side-scroll').height($(window).height()-230);
                // }else{
                    $('.layui-side-scroll').css('height','100%');
                // }
            });
            //初始化右边顶部的小tab的值
            $('.head-tab-box .tab-li').attr('data-href',$('.index-btn').attr('href-url'));

            var order ="";
            //菜单点击就在右则顶部添加或选中选项卡
            $('.layui-nav-tree .layui-nav-item dl a').on('click',function(){
                var url=$(this).attr('href-url');
                if(!url){
                    return false;
                }
                //匹配菜单名字
                var name=/([\u4e00-\u9fa5_a-zA-Z0-9]+)/.exec($(this).text())[1];
                var el_li=$('.head-tab-box li');
                var coin=false;
                var num=0;

                for(var i=0;i<el_li.length;i++){
                    if(el_li.eq(i).attr('data-href') == url){
                        coin=true;
                        num=i;
                        break;
                    }
                }
                if(coin){
                    el_li.removeClass('layui-this');
                    el_li.eq(num).addClass('layui-this');
                }else{
                    el_li.removeClass('layui-this');
                    $('.clear-box').before('<li class="tab-li layui-this" data-href="'+url+'"><span class="tab-name">'+name+'</span><i class="layui-icon layui-unselect layui-tab-close">ဆ</i></li>');

                }

                letfAdd();

                //插入选项卡后绑定事件
                //右则顶部选项卡的点击跳转
                $('.head-tab-box li').off('click',function(){});
                $('.head-tab-box li').on('click',function(){

                    var url=$(this).attr('data-href'); 
                    var iframe_url=$('#iframe').attr('src');
                    if(url==iframe_url){
                        return false
                    }
                    $('#iframe').attr('src','html'+url);
                    $('.head-tab-box li').removeClass('layui-this');
                    $(this).addClass('layui-this');
                });

                //右则顶部选项卡的点击关闭
                $('.head-tab-box .layui-tab-close').off('click',function(){});
                $('.head-tab-box .layui-tab-close').on('click',function(){
                    $(this).parents('.tab-li').remove();
                    letfAdd();
                });


            });

            $(document).on("contextmenu",".tab-li", function(){
                return false;
            });

            // 选项卡右键事件
            $(document).on("mousedown",".tab-li", function(e) {
                console.log($(this).attr('data-href'))
                order = $(this).attr('data-href');
                if (3 == e.which && $(this).index() > 0) {
                    // console.log($('.my-dblclick-box').html());
                    layer.tips($('.my-dblclick-box').html(), $(this), {
                        skin: 'dblclick-tips-box',
                        tips: 3,
                        time: false
                    });
                }
            });

            $(document).on('click', '.card-close-all', function () {
                // 删除
                layui.each($('.tab-li'), function (k, v) {
                    if (k > 0) {
                        // 删除
                        $(this).remove();
                    }
                });
                letfAdd();
                $('.tab-li').addClass("layui-this");
                $('#iframe').attr('src','html' + $('.tab-li').attr('data-href'));

            });

            $(document).on('click', '.card-closeOther', function () {
                console.log(order)
                if($('.tab-li').length == 2){
                    return
                }
                // 删除
                layui.each($('.tab-li'), function (k, v) {
                    if (k > 0 && order != $(this).attr('data-href')) {
                        // 删除
                        $(this).remove();
                    }
                });
                letfAdd();
                // $('.clear-box').before(order.prop("outerHTML"));
                // var tabLiLast = $('.tab-li')[$('.tab-li').length-1];
                // $(tabLiLast).addClass("layui-this");
                // $('#iframe').attr('src','html' + $(tabLiLast).attr('data-href'));
                // $('.head-tab-box .layui-tab-close').on('click',function(){
                //     $(this).parents('.tab-li').remove();
                // });
            });

            // 点击body关闭tips
            $(document).on('click', 'html', function () {
                layer.closeAll('tips');
            });

            // 监听顶部左侧导航
            function letfAdd(){
                var allLi = $('.tab-li');
                var ulWidth = $('.head-tab-box').outerWidth();
                var allLiWidth = 0;
                for(var q=0;q<allLi.length;q++){
                    allLiWidth += $(allLi[q]).outerWidth();
                    if($("#tabmore").length == 0){
                        if(allLiWidth > ulWidth){
                            $('.clear-box').before('<span class="layui-unselect layui-tab-bar" id="tabmore" lay-stope="tabmore" title="收缩"><i lay-stope="tabmore" class="layui-icon">&#xe61a</i></span>');
                        }
                    }else {
                        if(allLiWidth < ulWidth){
                            $("#tabmore").remove();
                        }
                    }
                }
            }

            $(document).on('click', '#tabmore', function () {
                if( $('.head-tab-box').hasClass("layui-tab-more")){
                    $(".head-tab-box").removeClass("layui-tab-more")
                }else {
                    $('.head-tab-box').addClass("layui-tab-more");
                }
            });

            //点击收缩与展开左侧菜单
            $('#head-img-btn').on('click',function(){
                var state=$(this).attr('data-state');
                if(state=='0'){
                    $('.side-info-bom').animate({'width':'0px','height':'0px'}).addClass('hidden');
                    $('#system_name').css('display','none');
                    $('.layui-nav-tree .layui-nav-item').removeClass('layui-nav-itemed');
                    $('.layui-layout-admin .layui-side').css('width','48px');
                    $('.layui-layout-admin .main-body').css({'left':'48px','min-width':'1318px'});
                    $(this).attr('data-state','1');
                }else{
                    $('.side-info-bom').animate({'width':'180px','height':'130px'}).removeClass('hidden');
                    $('#system_name').css('display','block');
                    $('.layui-layout-admin .layui-side').css('width','220px');
                    $('.layui-layout-admin .main-body').css({'left':'220px','min-width':'1147px'});
                    $(this).attr('data-state','0');
                }
            });

            //菜单图标点击展开
            $('.layui-nav-tree .layui-nav-item > a').on('click',function(){
                var state=$('#head-img-btn').attr('data-state');
                if(state=='0'){return false;}
                $('.side-info-bom').animate({'width':'180px','height':'130px'}).removeClass('hidden');
                $('#system_name').css('display','block');
                $('.layui-layout-admin .layui-side').css('width','220px');
                $('.layui-layout-admin .main-body').css({'left':'220px','min-width':'1147px'});
                $('#head-img-btn').attr('data-state','0');
            });
            $('.layui-nav-tree .layui-nav-item .index-btn').on('click',function(){
                $('.head-tab-box li').removeClass('layui-this');
                $('#iframe').attr('src','html'+ $(this).attr('href-url'));
            })

            //监听有三级菜单的位置点击二级菜单时的事件
            $("ul[lay-filter='side-main'] dl.layui-nav-child dd>a").on("click", function () {
                if($(this).attr('class')){
                    $(this).attr('class','');
                }else{
                    $(this).addClass('layui-nav-itemed');
                }
            })

        }
        // 顶部左侧菜单 [请求地址,过滤ID,是否展开,携带参数]
        , top_left: function (addr, obj, treeStatus, data) {
            // 添加HTML
            this.addTopLeftHtml(addr, obj, treeStatus, data);
        }
        /*// 顶部右侧菜单
         ,top_right: function(){

         }*/

    };

    // 输出
    exports('vip_nav', mod);
});


